/*// 获取数据 
var datas = localStorage.getItem('datas');
datas = datas ? JSON.parse(datas) : [];
// JSON.stringfy()将对象、数组转换成字符串；JSON.parse()将字符串转成json对象。  两者需配合使用

// 遍历数据
var Lis = "";
datas.forEach(function (v, i) {
    Lis += `<li>${v}</li>`;
});
$(".uls").html(Lis);

// 点击事件
$("#but").click(function () {
    var vals = $("#tex").val();
    $(".uls").append('<li>' + vals + '</li>');

    // 存儲
    datas.push(vals);
    localStorage.setItem("datas", JSON.stringify(datas))
});*/

//获取
var DataAll = localStorage.getItem('list');
//传换类型
DataAll = DataAll ? JSON.parse(DataAll) : [];


// 遍历数据
function rander() {
    var trs = '';
    DataAll.forEach(function (v) {
        trs += ` <tr>
            <td> ${v.name} </td>
            <td> ${v.phone} </td>
            <td> ${v.email} </td>
            <td>
                <button class="btn  btn-danger del">删除</button>
                <button class="btn  btn-danger">修改</button>
            </td>
        </tr>`
    });
    $(".table tbody").html(trs);
};

rander();

// 保存
$(".btncun").on('click', function () {
    var name = $('#stbNam').val(),
        phone = $('#phone').val(),
        email = $('#email').val();

    // 获取input中的值
    var obj = {
        'name': name,
        'phone': phone,
        'email': email,
    };

    // 数据添加
    DataAll.push(obj);
    localStorage.setItem('list', JSON.stringify(DataAll));

    // 页面添加
    var trs = `
        <tr>
            <td> ${obj.name} </td>
            <td> ${obj.phone} </td>
            <td> ${obj.email} </td>
            <td>
                <button class="btn  btn-danger del">删除</button>
                <button class="btn  btn-danger">修改</button>
            </td>
        </tr>
    `;
    $('.table tbody').append(trs);
});

// 删除
$("table tbody").on('click', '.del', function () {
    alert("确定要删除吗?");
    var tr = $(this).parent().parent();

    // 数据删除
    DataAll.splice(tr.index(), 1);
    localStorage.setItem('list', JSON.stringify(DataAll));

    tr.remove();
    

});